<template>
  <div id="Tab">
    <h1 >{{title}}排行</h1>
    <!-- 
      具名插槽：slot有个name属性 如果不给name属性 则它的name默认为default 
               在使用插槽传递给特定的slot时 需要使用v-slot指令
               v-slot指令的使用方法  v-slot:slot的name属性的值（不需要打引号）
               v-slot可以简写成#
     -->
    <slot name="content"></slot>
    <slot name='footer'>我是底部</slot>
  </div>
</template>

<script>
export default {
  name: "Tap",
  props:['title']
};
</script>

<style>
#Tab{
  background-color: antiquewhite;
  width: 300px;
  height: 400px;

}
#Tab h1{
    background-color: aquamarine;
    height: 60px;
}
</style>